
<template>
	<div class="index">

		<div class="center">
			<left></left>
			<div class="right">
          <top></top>
          <div class="hei10"></div>
          <div class="where" style="background: #fff; padding: 10px 30px; font-size: 14px; color: #595959;">当前位置：分销后台><router-link to="/productionBasismanag" style="color: #409eff;">产品渠道管理</router-link></div>
          <div class="hei10"></div>
                <div class="title">产品渠道中心</div>
				<div class="bsm">
					<el-form ref="form" @submit.native.prevent :model="form" label-width="80px">
						<el-form-item label="产品名称">
								<el-input v-model="title"></el-input>
								<el-button type="danger" size="mini" @click="search" style="margin-left:20px;">搜索</el-button>
						</el-form-item>
					</el-form>
				</div>

				<div class="con" v-loading="loading">
					<div class="list" style="padding-bottom: 0; padding-top: 0;">
						<div class="th bor1">商品名称</div>
						<div class="th bor1">商品编码</div>

						<div class="th bor1">发货数</div>
						<div class="th bor1">退货数</div>
						<div class="th bor1">当前库存数</div>
						<div class="th td2">操作</div>
					</div>

					<div class="list" v-for="item in list" :key="item.id">
                        <div class="td bor1">{{item.name}}</div>
                        <div class="td bor1">{{item.sku}}</div>
						<div class="td bor1">{{item.operator}}</div>
						<div class="td bor1">{{item.is_auto_produce}}</div>
						<div class="td bor1">{{item.created_at}}</div>
						<div class="td td2">
							<el-button type="text" size="mini" @click="go(item.id)">设置库存</el-button>
							<el-button type="text" size="mini" @click="see(item.id,item.name)">查看记录</el-button>
						</div>
					</div>

				</div>
				<el-pagination background layout="total,prev, pager, next" :current-page="page" @current-change="fanye" :page-size="pagesize" :total="total"></el-pagination>
			</div>
			<el-dialog title="修改生产方式" :visible.sync="is_auto_producelog" width="400px">
				<div>
					<el-radio-group v-model="is_auto_produce" @change="is_auto">
						<el-radio label="0">手动生产</el-radio>
						<el-radio label="1">自动生产</el-radio>
					</el-radio-group>
				</div>

				<span slot="footer" class="dialog-footer">
					<el-button type="primary" @click="changeis_auto_producego">确定</el-button>
				</span>
			</el-dialog>
		</div>

		<!-- <foot></foot> -->
	</div>
</template>

<script>
	import axios from 'axios'
	import top from '@/components/top.vue'
	import left from '@/components/left.vue'
	import foot from '@/components/foot.vue'

	export default{
		components: {
			"left": left,
			"top": top,
			"foot": foot
		},
		name: 'productionBasismanag',
		data(){
			return{
				form:{},
				list:"",
				title:"",
				loading:true,

				chooseid:"",
				is_auto_producelog:false,
				is_auto_produce:'0',

				total:0,
				page:1,
				pagesize:20
			}
		},
		created() {
			//按回车键搜索
            var that = this
            document.onkeydown = function(e){
            	var ev = document.all ? window.event : e;
            	if(ev.keyCode==13) {
            		that.search()
            	}
			}

			this.getpro()
		},

		methods:{
			is_auto:function(){
				console.log(this.is_auto_produce)
				var that = this;
				if(this.is_auto_produce == 1){
					axios.get('/api/plan-market/product/auto?product_id='+this.chooseid)
						.then(response => {
							if(response.data.msg.code == 0){
								if(response.data.data != null){

								}else{
									this.is_auto_produce = '0'
									that.$message.error("该产品未开发自动生产模块，请联系您的客服寻求支持！");
								}
							}else{
								that.$message.error(response.data.msg.info);
							}
						})
				}
			},
			goto:function(){
				this.$router.push({
					path: '/productionBasismanag/addBasis',
				})
			},
			//查看关联
			see:function(id,name){
				this.$router.push({
					path: '/productionBasis',
					query: { id: id,name: name }
				})
			},
			//跳转到修改页面
			go:function(id){
				this.$router.push({
					path: '/productionBasismanag/fixproductionBasis',
					query: { id: id }
				})
			},
			//修改生产方式
			changeis_auto_produce:function(id){
				this.chooseid = id
				this.is_auto_producelog = true
			},
			changeis_auto_producego:function(){
				this.loading = true
				var that = this;
				axios.post('/api/plan-market/product/edit',{is_auto_produce:this.is_auto_produce,product_id:this.chooseid})
					.then(response => {
						if(response.data.msg.code == 0){
							that.getpro()
							that.$message.success("修改成功");
							that.is_auto_producelog = false
						}else{
							that.$message.error(response.data.msg.info);
						}
					})
			},
			//翻页
			fanye:function(page){
				this.loading = true
				this.page = page
				this.getpro()
			},
			//搜索
			search:function(){
                this.page = 1
				this.loading = true
				this.getpro()
			},
			//获取商品
			getpro:function(){
                this.title = this.title.trim()
				var that = this;
				axios.get('/api/gth/products/list?order_by=0&page='+this.page+'&page_size='+this.pagesize+'&name='+encodeURIComponent(this.title))
					.then(response => {
						if(response.data.msg.code == 0){
							for( var i in response.data.data.data){
								if(response.data.data.data[i].is_auto_produce == 0){response.data.data.data[i].is_auto_produce = "手动生产"}
								if(response.data.data.data[i].is_auto_produce == 1){response.data.data.data[i].is_auto_produce = "自动生产"}
								if(response.data.data.data[i].operator == 10086){response.data.data.data[i].operator = "移动"}
								if(response.data.data.data[i].operator == 10010){response.data.data.data[i].operator = "联通"}
								if(response.data.data.data[i].operator == 10000){response.data.data.data[i].operator = "电信"}
                if(response.data.data.data[i].operator == 10099){response.data.data.data[i].operator = "中国广电"}
							}
							that.total = response.data.data.total
							that.list = response.data.data.data
							that.loading = false
						}else{
							if(response.data.msg.code == 50401){that.$router.push({ path: "/login" }); return false}
							that.$message.error(response.data.msg.info);
						}
					})
			}
		}
	}
</script>

<style lang="scss" scoped>

	.index{

				.title{border-bottom: 1px #EAEAEA solid; line-height: 45px; padding-left: 30px; font-size: 16px; background: #F9F9F9; color: #727272}
				.bsm{ padding: 20px 20px 0 20px;
					.el-input{ width: 220px;}
				}
				.row2{ color: #FFF;
					a{ color: #FFF;}
				}
				.con{ margin: 20px; border: 1px #EAEAEA solid;
					.list{ display: flex; text-align: center;  border-bottom: 1px #EAEAEA solid;
						.bor1{ border-right: 1px #EAEAEA solid;}
						.th{ background: #F9F9F9; line-height: 45px; flex: 1; font-size: 14px;  box-sizing: border-box;}

						.td{ line-height: 45px; font-size: 14px; flex: 1; box-sizing: border-box; color: #666;}
						.td2{ flex: 1.5}
					}
				}
				.el-pagination{ text-align: right; margin-right: 20px; padding-bottom: 50px;}


	}
</style>
